﻿

/*---------------------------- CSS Developed by SFI.VN ----------------------------*/

/* -------- Container CSS ---------*/
.w_container { width:100% }
.h_container { height:100% }
.sub_container { width:98%; height:98%; margin:1%; }
.sub_container-l { width:98%; margin-left:2% }
.sub_container-r { width:98%; margin-right:2% }
.sub_container-border { width:99.8%; margin:1px 0.1%; }
.img_container { width:90%; margin:5%; }
.w90 { width:90%; }
.w80 { width:80%; }
.w70 { width:70%; }
.w60 { width:60%; }
.w50 { width:50%; }
.w40 { width:40%; }
.w30 { width:30%; }
.w25 { width:25%; }
.w20 { width:20%; }
.w15 { width:15%; }
.w10 { width:10%; }

/* -------- Float CSS ---------*/
.fr{float: right;}
.fl{ float: left;}
/* -------- Unitl CSS ---------*/

.hide{ display: none; }
.clear { clear:both; }
.line-w { border-bottom: dotted 1px #D1D1D1; width:100%; }
.line-h  { border-left: dotted 1px #D1D1D1; height:100%; }
.line { border-bottom: solid 1px #DCDCDC; width:100%; }
.pointer { cursor:pointer; }
span.ui-icon { cursor:pointer }
.button { height:25px;cursor:pointer; margin: 0 3px; line-height:25px; padding: 0 10px; }
.buttonsmall { cursor:pointer; margin: 0 3px; line-height:20px; padding: 0 10px; }
a.button { line-height: 23px; height:23px; cursor:pointer; padding: 0 10px; }

/* - Text-Align CSS -*/
.text-l { text-align: left; }
.text-r { text-align: right; }
.text-j { text-align:justify; }
.text-c { text-align:center; }
.text-i { font-style:italic; }
.uppercase { text-transform:uppercase; }
.lowercase { text-transform:lowercase; }
.capitalize { text-transform:capitalize; }
.bold { font-weight:bold; }

/* -------- Text CSS ---------*/
.title-h { line-height:30px; font-size:2em; }
.title-h1 { line-height:30px; font-size : 1.5em; }
.title-h2 { line-height:25px; }
.title-h3 { line-height:20px; }
.title-h4 { line-height:20px; }
.title-h span.ui-icon { margin:7px 5px; }
.title-h2 span.ui-icon { margin:3px; }
.sfi-title { font-size:1.3em; }
.sfi-des {  text-align:justify; }
.sfi-body { text-align:justify; }
/* -------- Margin CSS ---------*/
.m10 { margin:10px; }
.m10-lr { margin: 0 10px; }
.m10-tb { margin: 10px 0; }
.m20 { margin:20x; }
.m20-tb { margin: 20px 0; }
.m20-lr { margin: 0 20px; }
.m5 { margin:5px; } 
.m5-tb { margin: 5px 0; }
.m5-lr { margin: 0 5px; }

/* -------- Padding CSS ---------*/
.p10-lr { padding: 0 10px; }
.p20-lr { padding: 0 20px; }
/* -------- Font-Size CSS ---------*/
.fs-9 { font-size:0.9em; line-height:1.5em; }

/* -------- Scroll  ---------*/
.scroll-a { overflow:auto; }

/* ERROR  
----------------------------------------------------------*/
#ErrorContent { margin:5px 0; }
.error { color:Red; }
.errorContainer { width:100%; }
#buttonError { display: none; }
.field-validation-error { color: #ff0000; }
.input-validation-error { border: 1px solid #ff0000; background-color: #ffeeee; }
#ErrorContent .validation-summary-errors { font-weight: bold; color: #ff0000; float:left; text-align:center; width:100%;  }
#ErrorContent .validation-summary-errors span { line-height:25px; margin-left:30%; float:left; text-align:right; }
#ErrorContent ul{ display:none ; text-align:left; margin:5px 0; float:left; width:100%; padding:0; list-style:decimal; }
#ErrorContent ul li {margin:2px 0 2px 5%; float:left; width:95%; }
span.validation-summary-errors{}

/* BORDER   
----------------------------------------------------------*/
.ui-border { border:1px solid #E0CFC2 }

/* CONTENT  
----------------------------------------------------------*/
.comboBox { width:200px; padding:2px 0; height:25px; line-height:25px;  }
.sfi-content {-moz-box-shadow:0 1px 3px rgba(0, 0, 0, 0.3);border-color:#E5E5E5 #DBDBDB #D2D2D2;border-style:solid;border-width:1px; }

/* -------- Input Output CSS ---------*/

/* -------- Item CSS ---------*/
.input-item input[type='text'] { float:left; width:99%; height:20px; }
.input-item input[type='password'] { float:left; width:99%; height:20px; }
.title-item { line-height:25px; width:25%; margin-right:5%; color:green; text-align:right; }
.input-item { width:65%; text-align:left; }




